<template>
  <div>
    <el-table :data="menu" style="width: 1450px" @selection-change="handleSelectionChange" >
      <el-table-column v-if="showIdColumn" prop="id" label="id" width="170" />
      <el-table-column type="selection" width="80" align="center"/>
      <el-table-column prop="barCode" label="条码" width="140"/>  
      <el-table-column prop="materialName" label="名称" width="140"/>  
      <el-table-column prop="standard" label="规格" width="170"/>  
      <el-table-column prop="model" label="型号" width="320"/>  
      <el-table-column prop="commodityUnit" label="单位" width="170"/>  
      <el-table-column prop="sumsl" label="数量" width="84"/>  
      <el-table-column prop="unitPrice" label="单价" width="82"/>  
      <el-table-column prop="allPrice" label="金额" width="82"/>  
      <el-table-column prop="taxRate" label="税率" width="82"/>  
      <el-table-column prop="taxMoney" label="税额" width="82"/>  
      <el-table-column prop="taxLastMoney" label="价格合计" width="82"/>  
      <el-table-column prop="remark" label="备注" width="82"/>  
    </el-table>

    <el-button type="primary" @click="saveSelected">保存</el-button>  
  </div>
</template>

<script lang="ts" setup>
import { ref, defineEmits, defineProps, onMounted } from 'vue';  
import { ElMessage } from 'element-plus';  
import request from '@/api/request';  

let emits = defineEmits(['close', 'iii']); 
let props = defineProps(["data"]);
let formData = ref(props.data ? [props.data] : []); 

const selectedItems = ref([]) 
const menu = ref([]);
const itid = ref([])

const handleSelectionChange = (val) => {  
  selectedItems.value = val; 
};

const saveSelected = () => {
  if (selectedItems.value.length === 0) {
    ElMessage.warning('请至少选择一项进行保存');
    return;
  }
  emits('iii', selectedItems.value);
  console.log('选中的数据:', selectedItems.value); 
  console.log('选中的数据:', selectedItems.value[0].id); 
};

const load = async () => {
  
const params = new URLSearchParams();//用于构建url字符串
params.append('headerId', formData.value[0].erpDepotItemList[0].headerId);
itid.value.forEach(item => {
params.append('linkIds', item.id); // 每个 ID 都添加为单独的参数
console.log('params:', params);
  
});
  
  try {
    const res = await request({
      url: '/erpmaterialinventory/list',
      method: 'get',
      params:params
    });
    menu.value = res.data;
  } catch (error) {
    console.error('加载数据失败:', error);
  }
};

const itemid = async () => {  
  try {
    const res = await request({
      url: '/sale/lookByitemid',
      method: 'get',
      params: {
        headerId: formData.value[0].erpDepotItemList[0].headerId,
      }
    });
    itid.value = res.data;
    console.log('itid:', itid.value);
  } catch (error) {
    console.error('获取 itemid 数据失败:', error);
  }
};

// 使用 onMounted 生命周期钩子来执行异步操作
onMounted(async () => {
  await itemid();  // 等待 itemid 完成
  await load();    // 然后再加载
});
</script>
